/**
* @file 审批详情
* @author  zhoushu
* @date  17/1/12
*/
<template>
  <div class="approval-content">
    <div class="approval-tab">
      <div class="mui-segmented-control">
        <a @tap="clickBtn($index)" v-for="list in tab" class="mui-control-item" :class="{'mui-active':$index==0}"
           :href="'#item'+$index">
          {{list.name}}
        </a>
      </div>
    </div>
    <div>
      <div id="item0" class="mui-control-content" :class="{'mui-active':tab.length==3}" v-if="tab.length==3">
        <div class="mui-scroll-wrapper" style="background: #fff;">
          <div class="mui-scroll">
            <div class="reg-content">
              <crm-file-list :file="otherdata.file" :btn="otherdata.btn"></crm-file-list>
              <div class="submit-data">
                <p v-if="otherdata.manager && otherdata.manager!==''">经办人：{{otherdata.manager}}</p>
                <p :class="{'text-center':!otherdata.manager || otherdata.manager==''}">
                  提交时间：{{otherdata.submitTime}}</p>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div :id="'item'+(tab.length==3?1:0)" class="mui-control-content" :class="{'mui-active':tab.length==2}">
        <crm-detail :data="infodata.basic" :detailedit="{}" :filedata="infodata.file"
                    :btndata="infodata.btn"></crm-detail>
      </div>
      <div :id="'item'+(tab.length==3?2:1)" class="mui-control-content">
        <div class="mui-scroll-wrapper" style="background: #fff;">
          <div class="mui-scroll">
            <div class="approval-list">
              <ul class="mui-table-view">
                <li class="mui-table-view-cell" v-for="list in approvedata">
                  <div class="mui-slider-handle mui-table">
                    <div class="icon">
                      <span class="top line"></span>
                      <span class="head mui-icon">
                      <img v-if="!list.headPhotoUrl || list.headPhotoUrl==''" src="../../images/default_contact.png">
                      <img v-else :src="list.headPhotoUrl">
                    </span>
                      <span v-if="$index !== (approvedata.length-1)" class="bottom line"></span>
                    </div>
                    <p>
                      <span class="role">{{list.roleName}}</span>
                      <span class="action">{{list.isConfirmText || list.isApprovedText}}</span>
                      <span class="time">{{list.updatedOn}}</span>
                    </p>
                    <p>
                      <span class="name">{{list.operatorName}}</span>
                        <span v-if="list.approvedResultText" class="result"
                              :class="{'refuse':list.approvedResultText == '拒绝'}">{{list.approvedResultText}}</span>
                    </p>
                    <p class="remark">
                      {{list.remark}}
                    </p>
                  </div>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  import crmDetail from '../../components/crmDetail/detail.vue';
  import crmFileList from '../../components/crmFile/fileList.vue';
  // import store from '../store';
  export default{
    components: {
      'crm-detail': crmDetail,      // 中间详情组件,含附件
      'crm-file-list': crmFileList
    },
    props: {
      tab: [],  //  tab数组
      otherdata: {'file': [], 'btn': []}, //  第一个tab
      infodata: {'basic': [], 'file': [], 'btn': []},  //  第二个tab
      approvedata: []  //  第三个tab
    },
    methods: {
      clickBtn: function (index) {
        var self = this;
        var tab = self.tab;
        if (tab.length === 2) {
          this.$dispatch('clickBtnTWo', index);
        } else {
          this.$dispatch('clickBtnThree', index);
        }
      }
    },
    created: function () {
    },
    route: {
      data: function () {
      }
    },
    ready: function () {
      mui('.mui-scroll-wrapper').scroll();
    }
  };
</script>
